<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE composition PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<ui:composition xmlns:ui="http://xmlns.jcp.org/jsf/facelets"
                template="./templates/templateHome.xhtml"
                xmlns="http://www.w3.org/1999/xhtml"
                xmlns:h="http://xmlns.jcp.org/jsf/html"
                xmlns:p="http://primefaces.org/ui"
                xmlns:f="http://xmlns.jcp.org/jsf/core">

    <ui:define name="title">
        Listar Reserva
    </ui:define>

    <ui:define name="content">

        <h:form id="formListarReserva">

            <center>
                <p:dataTable id="dataTableListarReserva" paginator="true" rows="5" style="width: 80%;"
                             paginatorPosition="bottom" paginatorTemplate="{CurrentPageReport} {FirstPageLink}
                             {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}"                                 
                             paginatorAlwaysVisible="false"
                             rendered="#{not empty reservaBean.lista}"  
                             var="reserva" value="#{reservaBean.lista}">

                    <p:column headerText="Nome do recurso" style="width:20%">
                        <h:outputText value="#{reserva.recurso.nome}"/>
                    </p:column>

                    <p:column headerText="Data" style="width:5%">
                        <h:outputText value="#{reserva.dataReserva}">
                            <f:convertDateTime dateStyle="medium"/>
                        </h:outputText>
                    </p:column>

                    <p:column headerText="Hora Início" style="width:10%">
                        <h:outputText value="#{reserva.horaInicio}">
                            <f:convertDateTime pattern="HH:mm"/>
                        </h:outputText>
                    </p:column>

                    <p:column headerText="Hora Fim" style="width:10%">
                        <h:outputText value="#{reserva.horaFim}">
                            <f:convertDateTime pattern="HH:mm"/>
                        </h:outputText>
                    </p:column>

                    <p:column headerText="Detalhe" style="width:10%">
                        <center>
                            <p:commandButton id="btnDetalharReserva" title="Detalhar reserva" label="Detalhe" icon="icon-detalhar"
                                             oncomplete="dialogDetalharReserva.show()"
                                             update=":formListarReserva">
                                <f:setPropertyActionListener value="#{reserva}" target="#{reservaBean.reservaSelecionada}"/>
                            </p:commandButton>
                        </center>
                    </p:column>

                </p:dataTable>
            </center>

            <p:dialog id="dialogDetalharReserva" header="Detalhe da reserva" widgetVar="dialogDetalharReserva" resizable="false"  
                      width="200" showEffect="fade" hideEffect="fade" modal="true" draggable="false">
                <h:panelGrid id="panelGridListarReserva" columns="2">

                    <f:facet name="header">
                        <p:graphicImage value="/resources/images/#{reservaBean.reservaSelecionada.recurso.nome}.jpg"/>
                    </f:facet>

                    <h:outputLabel value="Código da Reserva:"/>
                    <h:outputText value="#{reservaBean.reservaSelecionada.codReserva}"/>

                    <h:outputLabel value="Nome do recurso:"/>
                    <h:outputText value="#{reservaBean.reservaSelecionada.recurso.nome}"/>

                    <h:outputLabel value="Nome do Usuário:"/>
                    <h:outputText value="#{reservaBean.reservaSelecionada.usuario.nomeUsuario}"/>

                    <h:outputLabel value="Data:"/>
                    <h:outputText value="#{reservaBean.reservaSelecionada.dataReserva}">
                        <f:convertDateTime dateStyle="medium"/>
                    </h:outputText>

                    <h:outputLabel value="Hora Início:"/>
                    <h:outputText value="#{reservaBean.reservaSelecionada.horaInicio}">
                        <f:convertDateTime pattern="HH:mm"/>
                    </h:outputText>

                    <h:outputLabel value="Hora Fim:"/>
                    <h:outputText value="#{reservaBean.reservaSelecionada.horaFim}">
                        <f:convertDateTime pattern="HH:mm"/>
                    </h:outputText>

                </h:panelGrid>
            </p:dialog>

        </h:form>

    </ui:define>

</ui:composition>